import React, { useEffect, useState } from 'react'
import { Switch, Route, Redirect } from 'react-router-dom'
import Home from '../../views/sandBox/home/Home'
import UserList from '../../views/sandBox/user-manage/UserList'
import RouteList from '../../views/sandBox/right-manage/RoleList'
import RightList from '../../views/sandBox/right-manage/Right.list'

import Add from '../../views/sandBox/right-manage/Add'
// 新闻列表
import Draftbox from '../../views/sandBox/news-mannage/Draftbox'
import Editnews from '../../views/sandBox/news-mannage/Editnews'
import NotPermission from '../../views/NotPermission/NotPermission'
import Newsclassification from '../../views/sandBox/news-mannage/Newsclassification'
import NewsUpdate from '../../views/sandBox/news-mannage/NewsUpdate'
import NewsPreview from '../../views/sandBox/news-mannage/NewsPreview'
// 审核
import Auditnews from '../../views/sandBox/to-examine/Auditnews'
import Auditlist from '../../views/sandBox/to-examine/Auditlist'
// 发布管理
import Unpublished from '../../views/sandBox/release/Unpublished'
import Published from '../../views/sandBox/release/Published'
import Offline from '../../views/sandBox/release/Offline'
import axios from 'axios'
import { toBeChecked } from '@testing-library/jest-dom/dist/matchers'
import {Spin} from 'antd'
import { connect } from 'react-redux'
function NewsRouter(props) {
    const [backRouteList, setbackRouteList] = useState([])
    useEffect(() => {
        Promise.all([
            axios.get("/rights"),
            axios.get("/children"),
        ]).then(res => {
            // console.log(res, [...res[0].data, ...res[1].data])
            setbackRouteList([...res[0].data, ...res[1].data])
        })
    }, [])
    const localRouterMap = {
        '/home': Home,
        '/user-manage/list': UserList,
        '/right-manage/role/list': RouteList,
        '/right-manage/right/list': RightList,
        '/news-manage/add': Add,
        '/news-manage/draft': Draftbox,
        '/news-manage/preview/:id': NewsPreview,
        '/news-manage/update/:id': NewsUpdate,
        '/news-manage/category': Newsclassification,
        '/audit-manage/list': Auditlist,
        '/audit-manage/audit': Auditnews,
        '/publish-manage/unpublished': Unpublished,
        '/publish-manage/published': Published,
        '/publish-manage/sunset': Offline,
    }
    const checkedRoute = (item) => {
        return localRouterMap[item.key] && (item.pagepermisson == 1 || item.routepermisson)
    }
    const { role: { rights } } = JSON.parse(localStorage.getItem("token"))
    // console.log(rights)
    const checkUerPermission = (item) => {
        return rights.includes(item.key)
    }
    return (
        <div>
            <Spin size="large" spinning={props.isLoading}>
                <Switch>
                    {
                        backRouteList.map(item => {
                            {
                                if (checkedRoute(item) && checkUerPermission(item)) {
                                    return <Route
                                        path={item.key}
                                        key={item.key}
                                        component={localRouterMap[item.key]}
                                        exact
                                    ></Route>
                                }
                                return null
                            }
                        })
                    }
                    <Redirect from="/" to="/home" exact></Redirect>
                    {
                        backRouteList.length > 0 && <Route path="*" component={NotPermission}></Route>
                    }
                </Switch>
            </Spin>
        </div>
    )
}

const mapStateToProps = ({LoadingReducer:{isLoading}})=>({
    isLoading
  })
export default connect(mapStateToProps)(NewsRouter)